$(function(){
    var $section = $(".section");
    var $nav_panel = $("#nav_panel");

    $(window).scroll(function(){
        var scrollTop = $("html , body").scrollTop();
        starisBtnToggle(scrollTop);
        setStarisButtonIndex(scrollTop);
         
    });
    function starisBtnToggle(scrollTop){
        if(scrollTop > 600){
            $nav_panel.show();
        }else{
            $nav_panel.hide();
        }
    };
    var section_top_list = [];
    for(var i = 0 ; i < $section.length ; i++){
        section_top_list.push($section.eq(i).offset().top)
    }
    var $nav_panel_btn = $("#nav_panel li")
    
    //dom 操作
    function setStarisButtonIndex(scrollTop){
        $nav_panel_btn.eq( getButtonIndex(scrollTop) ).addClass("active")
         .siblings()
         .removeClass("active")
    }

    //获取下标
    function getButtonIndex(scrollTop){
        if(scrollTop <= section_top_list[0]){
            return 0;
        }else if(scrollTop >= section_top_list[section_top_list.length - 1]){
            return section_top_list.length - 1;
        }else{
            for(var i = 0 ; i < section_top_list.length - 1 ; i++){
                if(scrollTop >= section_top_list[i] && scrollTop < section_top_list[i + 1]){
                    return i+1;
                }
            }
        }
    }
    $(window).trigger("scroll");

    //点击按钮让页面跳转到对应楼层
    $("#nav_panel li").click(function(){
        var index = $(this).index("#nav_panel li");
        var _top = $section.eq(index).offset().top;
        $("html , body").stop(true)
        .animate({
            scrollTop : _top
        });
    })
})